// components/inputNumber/inputNumber.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    min: {          // 最小值
      type: Number,
      value: 0
    },
    max: {          // 最大值
      type: Number,
      value: 10
    },
    step: {         // 步数 定义递增递减的步数控制
      type: Number,
      value: 1
    },
    value: {
      type: Number, // 当前默认值
      value: 0,     
    },
    animate: {
      type: Boolean,
      value: 0
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    animate_data: {},
    show_text: 0,       // 数字显示状态
    show_sub: 0,        // 减号显示状态
  },

  ready() {
    let {value, min, max, step} = this.data;

    this.animate = wx.createAnimation({
      duration: 300,
      timingFunction: 'ease-out'
    });
  },

  attached() {
    let { value, min, show_text, animate, show_sub } = this.data;
    !animate && (show_text = 1) && (show_sub = 1);
    value = min;
    this.setData({
      value, show_text, show_sub
    })
  },

  /**
   * 组件的方法列表
   */
  methods: {
    isFlag(val) {
      return Math.round(val) === val;
    },

    calc(e) {
      let {type} = e.currentTarget.dataset;
      let { value, min, max, step, animate } = this.data;
      switch(type) {
        case '+':
          animate && this.subAnimation(type);
          value += step;
          if(value >= max) {
            value = max;
          }
          break;
        case '-':
          value -= step;
          if(value <= min) {
            animate && this.subAnimation(type);
            value = min;
          }
          break;  
      }
      this.triggerEvent('callback', {value: value}, {});
      this.setData({
        value
      })
    },

    subAnimation(type) {
      let {show_text} = this.data;
      if(type == '+') {
        this.animate.rotate(-180, 180).opacity(1).right(54).step();
        show_text = 1;
      } else if('-') {
        this.animate.rotate(180, -180).opacity(0).right(0).step();
        show_text = 0;
      }

      this.setData({
        animate_data: this.animate.export(),
        show_text
      })
    },
  }
})
